<template>
  <div>
    <button v-pengfan.aaa.bbb="'fanfan'" @click="increment">当前计数：{{ counter }}</button>
    <h2 v-format-time="'YYYY/MM/DD'">{{timestamp}}</h2>
    <h2 v-format-time>{{timestamp}}</h2>
    <h2 v-format-time>{{timestamp}}</h2>
  </div>
</template>

<script>
import { ref } from "vue";

export default {
  //局部指令
  directives: {
    pengfan: {
      created(el, bindings, vnode, preVnode) {
        console.log("pengfan created", el, bindings, vnode, preVnode);
        console.log(bindings.value);
        console.log(bindings.modifiers);
      },
      mounted() {
        console.log("pengfan mounted");
      },
      beforeUpdate() {
        console.log("pengfan beforeUpdate");
      },
      updated() {
        console.log("pengfan updated");
      },
      beforeUnmount() {
        console.log("pengfan beforeUnmount");
      },
      Unmount() {
        console.log("pengfan Unmount");
      },
    },
  },

  setup() {
    const counter = ref(0);
    const timestamp = 1624501455;
    const increment = () => counter.value++;

    return {
      counter,
      timestamp,
      increment,
    };
  },

 
};
</script>

<style scoped>
</style>